<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>大麦商城</title>
<link href="css/slider.css" rel="stylesheet" type="text/css"/>
<link href="css/common.css" rel="stylesheet" type="text/css"/>
<link href="css/index.css" rel="stylesheet" type="text/css"/>
	<script src="http://47.106.66.89:8080/js/vue.min.js"></script>
	<script src="http://47.106.66.89:8080/js/axios.min.js"></script>
	<link  href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
	<script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
	<script src="/user/login/js/login.js"></script>
</head>
<body>
<div id="app">
	<div class="container header">


	<div class="span5">
			<div class="logo">
				<a href="index.html">
					<img src="image/r___________renleipic_01/logo.png" alt="依依不舍"/>
				</a>
			</div>
		</div>
		<div class="span9">
	<div class="headerAd">
		<img src="image/header.jpg" width="320" height="50" alt="正品保障" title="正品保障"/>
	</div>	</div>
	<div class="span10 last">
			<div class="topNav clearfix">
				<ul>

					<login route="/user">
<!--						<template #nologin></template>-->
						<template #logined="a">
							<li class="headerLogin" style="display: list-item;">
								{{a.user.cname}}|
							</li>
							<li class="headerLogin" style="display: list-item;">
								<a href="olist.html">我的订单</a>|
							</li>
							<li id="headerRegister" class="headerRegister" style="display: list-item;">
								<a href="/user/login/logout">退出</a>|
							</li>
						</template>
					</login>






					<li id="headerUsername" class="headerUsername"></li>
					<li id="headerLogout" class="headerLogout">
						<a>[退出]</a>|
					</li>
							<li>
								<a>会员中心</a>
								|
							</li>
							<li>
								<a>购物指南</a>
								|
							</li>
							<li>
								<a>关于我们</a>

							</li>
				</ul>
			</div>
			<div class="cart">
				<a  href="cart.html">购物车</a>
			</div>
				<div class="phone">
					客服热线:
					<strong>96008/53277764</strong>
				</div>
		</div>



	<div class="span24">
			<ul class="mainNav">
						<li>
							<a href="index.html">首页</a>
							|
						</li>

						<li>
	<a href="clist.html?1&pageIndex=1">
						女装男装
	</a>
						|</li>

						<li>
	<a href="clist.html?2&pageIndex=1">
						鞋靴箱包
	</a>
						|</li>

						<li>
	<a href="clist.html?3&pageIndex=1">
						运动户外
	</a>
						|</li>

						<li>
	<a href="clist.html?4&pageIndex=1">
						珠宝配饰
	</a>
						|</li>

						<li>
	<a href="clist.html?5&pageIndex=1">
						手机数码
	</a>
						|</li>

						<li>
	<a href="clist.html?6&pageIndex=1">
						家电办公
	</a>
						|</li>

						<li>
	<a href="clist.html?7&pageIndex=1">
						护肤彩妆
	</a>
						|</li>

			</ul>
		</div>


	</div>

	<div class="container index">
			<div v-if="promotion" class="span24">
			<div id="hotProduct" class="hotProduct clearfix">
				<div class="title">
					<strong>{{promotion.title}}秒杀商品</strong>
					<!-- <a ></a> -->
				</div>
				<ul class="tab">
					<li class="current" style="width: 100%; color:#fff">
						{{promotion.time}} {{promotion.status == 0 ? '即将开始' : '即将结束'}}
					</li>
				</ul>
				<ul class="tabContent" style="display: block;">
					<li v-for=" d in promotion.details">
						<a :href="'detail.html?id='+d.product.id">
							<img :src="d.product.image" style="display: block;">
						</a>
					</li>
				</ul>
			</div>
		</div>
			<div class="span24">
				<div id="hotProduct" class="hotProduct clearfix">
						<div class="title">
							<strong>热门商品</strong>
							<!-- <a ></a> -->
						</div>
						<ul class="tab">
								<li class="current">
									<a href="./蔬菜分类.htm?tagIds=1"></a>
								</li>
								<li>
									<a ></a>
								</li>
								<li>
									<a></a>
								</li>
						</ul>
							<ul class="tabContent" style="display: block;">

								<li v-for=" p in hots">
									<a :href="'detail.html?id='+p.id"><img :src="p.image" style="display: block;"></a>
								</li>


							</ul>
				</div>
			</div>
			<div class="span24">
				<div id="newProduct" class="newProduct clearfix">
						<div class="title">
							<strong>最新商品</strong>
							<a ></a>
						</div>
						<ul class="tab">
								<li class="current">
									<a href="./蔬菜分类.htm?tagIds=2"></a>
								</li>
								<li>
									<a ></a>
								</li>
								<li>
									<a></a>
								</li>
						</ul>
							 <ul class="tabContent" style="display: block;">

										<li>
											<a href="detail.html?72"><img src="products/1/cs10011.jpg" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?57"><img src="products/1/cs60006.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?4"><img src="products/1/cs10004.jpg" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?45"><img src="products/1/cs50004.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?51"><img src="products/1/cs50010.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?68"><img src="products/1/cs70007.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?60"><img src="products/1/cs60009.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?30"><img src="products/1/cs30010.png" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?6"><img src="products/1/cs10006.jpg" style="display: block;"></a>
										</li>

										<li>
											<a href="detail.html?2"><img src="products/1/cs10002.jpg" style="display: block;"></a>
										</li>

							</ul>
				</div>
			</div>
			<div class="span24">
				<div class="friendLink">
					<dl>
						<dd>新手指南</dd>
								<dd>
									<a >支付方式</a>
									|
								</dd>
								<dd>
									<a >配送方式</a>
									|
								</dd>
								<dd>
									<a >售后服务</a>
									|
								</dd>
								<dd>
									<a >购物帮助</a>
									|
								</dd>
								<dd>
									<a >蔬菜卡</a>
									|
								</dd>
								<dd>
									<a >礼品卡</a>
									|
								</dd>
								<dd>
									<a>银联卡</a>
									|
								</dd>
								<dd>
									<a >亿家卡</a>
									|
								</dd>

						<dd class="more">
							<a >更多</a>
						</dd>
					</dl>
				</div>
			</div>
		</div>
	<div class="container footer">
		<div class="span24">
			<div class="footerAd">
						<img src="image/footer.jpg" width="950" height="52" alt="我们的优势" title="我们的优势">
	</div>	</div>
		<div class="span24">
			<ul class="bottomNav">
						<li>
							<a>关于我们</a>
							|
						</li>
						<li>
							<a>联系我们</a>
							|
						</li>
						<li>
							<a>招贤纳士</a>
							|
						</li>
						<li>
							<a>法律声明</a>
							|
						</li>
						<li>
							<a>友情链接</a>
							|
						</li>
						<li>
							<a>支付方式</a>
							|
						</li>
						<li>
							<a>配送方式</a>
							|
						</li>
						<li>
							<a>服务声明</a>
							|
						</li>
						<li>
							<a>广告声明</a>

						</li>
			</ul>
		</div>
		<div class="span24">
			<div class="copyright">Copyright © 2005-2013 大麦商城 版权所有</div>
		</div>
	</div>
</div>

<script>
	var v = new Vue({
		el : "#app",
		data : {
			hots: [],
			promotion: null
		},
		created(){
			axios.get("queryHots").then(res=>this.hots=res.data);
			axios.get("dacu/getPromotion").then(res=> {
				this.promotion = res.data;
				this.promotion.begin = new Date(Date.parse(this.promotion.begin));
				this.promotion.end = new Date(Date.parse(this.promotion.end));
				window.setInterval(()=>{
					let ms = (this.promotion.status == 0 ? this.promotion.begin : this.promotion.end) - new Date();
					this.promotion.time = new Date(ms).toISOString().substring(11,19);
					this.$forceUpdate();
				},1000);
			})
		}
	})
</script>

</body></html>